<template>
	<view class="order-paid">
		<view class="content">
			<image src="/static/images/common/memberslogn.png" class="memberslogn" mode=""></image>
			<card-com>
				<view class="bought">
					<view class="title" v-if="successed">
						<image class="icon"
							src="https://littleshop.oss-cn-beijing.aliyuncs.com/images/mini/icons/circle-check.png">
						</image>
						<view class="desc">恭喜购买成功！</view>
					</view>
					<view class="title" v-if="fail">
						<image  src="/static/images/common/fail.png" class="failpng"></image>
						<view class="desc descfail">支付失败！</view>
					</view>
					<view class="check">
						<button class="button" open-type="launchApp" :app-parameter="paystate">返回APP</button>
					</view>
				</view>
			</card-com>
		</view>
	</view>
</template>

<script>
	import store from 'store'
	import { mapGetters,mapActions } from 'vuex'
	import { payOrderByAdapayWxmini,payVipPurchaseByAdapayWxmini } from "api/paymentApi"
	import { wxpay } from "helpers/paymentHelper"
	export default {
		name: "paidApp",
		store,
		mixins: [],
		data() {
			return {
				wxCode: '',
				successed:false,
				fail:false,
				order_id:'',
				type:'order',
				paystate:false
				
			}
		},
		computed: {
		    ...mapGetters(['isLogin'])
		},
		async onShow() {
		    
		},
		methods: {
			async payCurrentOrder() {
				const payload = await payOrderByAdapayWxmini(this.order_id)
				await this.wxpay(payload.result, 'order')
			},
			async payVipPurchaseByAdapayWxmini() {
				const payload = await payVipPurchaseByAdapayWxmini(this.order_id)
				await this.wxpay(payload.result, 'vipPurchase')
			},
			async wxpay(payload, type='order'){
				let _this = this;
				uni.requestPayment({
				    provider: 'wxpay',
				    timeStamp: payload.timeStamp,
				    nonceStr: payload.nonceStr,
				    package: payload.package,
				    signType: payload.signType,
				    paySign: payload.paySign,
				    success: function (res) {
				        _this.successed = true
						_this.fail = false
						_this.paystate= true
				    },
				    fail: function (err) {
						_this.successed = false
						_this.paystate= false
						_this.fail = true
				        uni.showModal({
				            title: '提示',
				            content: '支付失败！',
				            showCancel: false
				        })
				    }
				})
			}
		},
		async onLoad(options) {
			this.order_id = options.order_id
			this.type = options.type
			if (!await this.isLogin) {
			    uni.redirectTo({url: '/packs/one/pages/auth/auth?order_id=' + this.order_id + '&type=' + this.type})
			}else{
				if(this.type == 'order'){
					await this.payCurrentOrder()
				}else{
					await this.payVipPurchaseByAdapayWxmini()
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.order-paid {
		.content {
			padding: 20rpx;
			margin-top: 150rpx;

			.product {
				display: flex;
				align-items: center;

				.cover {
					width: 120rpx;
					height: 120rpx;
					margin-right: 20rpx;
				}

				.desc {
					font-size: 24rpx;
				}
			}

			.bought {
				.title {
					display: flex;
					align-items: center;
					// width: 280rpx;
					width: 300rpx;
					justify-content: center;
					margin: 0 auto;

					.icon {
						width: 30rpx;
						height: 30rpx;
						margin-right: 10rpx;
					}

					.desc {
						text-align: center;
						margin: 20rpx auto;
					}
					.descfail{
						color:#999999;
					}
				}

				.check {
					.button {
						width: 560rpx;
						height: 70rpx;
						line-height: 70rpx;
						background: linear-gradient(138deg, #FFDF63 0%, #FEBF05 100%);
						border: none !important;
						border-radius: 52rpx;
						font-size: 30rpx;
						// color: #333333;
						margin: 40rpx auto 30rpx;
						color: #FFFFFF;
						letter-spacing: 2rpx;
					}

					.button::after {
						border: none;
					}
				}
			}
		}
	}

	.memberslogn{
		display: block;
		width: 240rpx;
		height:80rpx;
		margin: 0 auto;
	}
	.failpng{
		display:block;
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}
	
</style>
